// 防抖
const debounce = (fn, time) => {
    let timer = null;
    return (...args) => {
        if(timer) clearTimeout(timer)
        timer = setTimeout(() => {
            fn.apply(this, args)
        }, time)
    }
}

//节流
const throttle = (fn, time) => {
    let timer = null;
    return (...args) => {
        if(timer) return
        timer = setTimeout(() => {
            fn.apply(this, args)
            timer = null
        }, time)
    }
}

/**
 * 功能测试，使用场景
 */

const debounceInput = document.querySelector('#debounceInput')
const debounceText = document.querySelector('#debounceText')

const throttleInput = document.querySelector('#throttleInput')
const throttleText = document.querySelector('#throttleText')

const debounceTest = debounce((val) => {
    console.log('防抖测试',val)
    debounceText.textContent = val
}, 500)

const throttleTest = throttle((val) => {
    console.log('节流测试',val)
    throttleText.textContent = val
}, 500)


debounceInput.addEventListener('input', (e) => {
    debounceTest(e.target.value)
})
throttleInput.addEventListener('input', (e) => {
    throttleTest(e.target.value)
})